{% extends "base.html" %}

{% block title %}问题反馈 - 风之宿{% endblock %}

{% block content %}
<div class="container mx-auto px-4 py-8">
  <div class="max-w-2xl mx-auto">
    <h1 class="text-3xl font-bold text-primary mb-8">问题反馈</h1>

    <div class="bg-white rounded-lg shadow-md p-6">
      <p class="text-gray-600 mb-6">
        如果您在住宿过程中遇到任何问题或有任何建议，请随时告诉我们。我们将尽快处理您的反馈。
      </p>

      <form method="POST" class="space-y-6">
        <div>
          <label for="title" class="block text-sm font-medium text-gray-700 mb-2">问题标题</label>
          <input type="text" id="title" name="title" required
                 class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-primary focus:border-primary"
                 placeholder="请简要描述问题">
        </div>

        <div>
          <label for="description" class="block text-sm font-medium text-gray-700 mb-2">详细描述</label>
          <textarea id="description" name="description" rows="6" required
                    class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-primary focus:border-primary"
                    placeholder="请详细描述您遇到的问题或建议..."></textarea>
        </div>

        <div class="bg-blue-50 p-4 rounded-md">
          <h3 class="text-lg font-semibold text-blue-800 mb-2">反馈说明</h3>
          <ul class="text-sm text-blue-700 space-y-1">
            <li>• 我们将在24小时内回复您的反馈</li>
            <li>• 紧急问题请直接拨打服务电话：0123-45-6789</li>
            <li>• 您的反馈将帮助我们改进服务</li>
          </ul>
        </div>

        <button type="submit" class="w-full bg-primary text-white py-3 px-4 rounded-md hover:bg-primary/90 transition-colors font-semibold">
          提交反馈
        </button>
      </form>
    </div>
  </div>
</div>
{% endblock %}